
<!-- Copyright IBM Corp, All Rights Reserved.

 SPDX-License-Identifier: Apache-2.0
-->

{% extends "layout.html" %}
{% block title %}Chains{% endblock %}
{% block body %}
    {{ super() }}
    <!-- Glyphicon in a H1 tag -->
    {% if type != "released" %}
        <h2 class="page-header">Chains {{ type }}: {{ items_count }}
            <button
                    type="button"
                    class="btn btn-primary btn-success btn-default pull-sm-right"
                    data-toggle="modal"
                    style="float:right"
                    data-target="#newClusterModal"
                    {% if hosts_available|length <= 0 %}
                    disabled
                    {% endif %}
            >
                Add Chain
            </button>
        </h2>
    {% else %}
        <h2 class="page-header">Chains {{ type }}: {{ items_count }}</h2>
    {% endif %}

    {% if items_count > 0 %}
        <div class="row">
            <table id="table_clusters"
                   class="table table-striped table-bordered table_sorted"
            >
                {% if type=="active" %}
                    <thead align="center">
                    <tr>
                        <th>Name</th>
                        <th>Type</th>
                        <th>Status</th>
                        <th>Health</th>
                        <th>Size</th>
                        <th>Host</th>
                        <th></th>
                    </tr>
                    </thead>
                    <tbody>
                    {% for item in items %}
                        {% if item.user_id %}
                            <tr style="background-color:lightgray">
                                {% else %}
                            <tr>
                        {% endif %}
                    <td>
                        <a href="/view/cluster/{{ item.id }}?released=0">{{ item.name }}</a>
                    </td>
                    {% if item.consensus_plugin== consensus_plugins[0] or item.consensus_plugin== consensus_plugins[2] %}
                        <td>{{ item.consensus_plugin }}</td>
                    {% else %}
                        <td>{{ item.consensus_plugin }}/{{ item.consensus_mode }}</td>
                    {% endif %}
                    <td>
                        {% if item.status == "running" %}
                            <font color="green">{{ item.status }}</font>
                        {% else %}
                            <font color="red">{{ item.status }}</font>
                        {% endif %}
                    </td>
                    <td>
                        {% if item.health == "OK" %}
                            <font color="green">{{ item.health }}</font>
                        {% else %}
                            <font color="red">{{ item.health }}</font>
                        {% endif %}
                    </td>
                    <td>{{ item.size|string }}</td>
                    <td>
                        <a href="/view/host/{{ item.host_id }}">{{ item.host_id }}</a>
                    </td>
                    <td>
                        <div class="dropdown">
                            <button class="btn btn-sm btn-primary btn-info btn-default dropdown-toggle"
                                    type="button" id="chain_actions"
                                    data-toggle="dropdown">
                                Actions
                                <span class="caret"></span>
                            </button>
                            <ul class="dropdown-menu" role="menu">

                                <li
                                        {% if item.status == "running" %}
                                            class="disabled"
                                        {% endif %}
                                >
                                    <a href="#"
                                       class="chain_action_start"
                                       data-id="{{ item.id }}"
                                       title="Start a chain"
                                    >
                                  <span class="glyphicon glyphicon-play"
                                        aria-hidden="true"></span>
                                        Start
                                    </a>
                                </li>
                                <li
                                        {% if item.status != "running" %}
                                            class="disabled"
                                        {% endif %}
                                >
                                    <a href="#"
                                       class="chain_action_stop"
                                       data-id="{{ item.id }}"
                                       title="Stop a chain"
                                    >
                                  <span class="glyphicon glyphicon-stop"
                                        aria-hidden="true"></span>
                                        Stop
                                    </a>
                                </li>
                                <li>
                                    <a href="#"
                                       class="chain_action_restart"
                                       data-id="{{ item.id }}"
                                       title="Restart a chain"
                                    >
                                  <span class="glyphicon glyphicon-repeat"
                                        aria-hidden="true"></span>
                                        Restart
                                    </a>
                                </li>
                                <li>
                                    <a href="#"
                                       class="chain_action_delete"
                                       data-id="{{ item.id }}"
                                       data-col_name="{{ col_name }}"
                                       title="Delete a chain"
                                    >
                                  <span class="glyphicon glyphicon-trash"
                                        aria-hidden="true"></span>
                                        Delete
                                    </a>
                                </li>
                                <li class="disabled">
                                    <a href="#"
                                       class="chain_action_release"
                                       data-id="{{ item.id }}"
                                       title="Release a chain"
                                    >
                                  <span class="glyphicon glyphicon-refresh"
                                        aria-hidden="true"></span>
                                        Release
                                    </a>
                                </li>
                            </ul>
                        </div>
                        <!--
                        <button
                                type="button"
                                class="btn btn-xs btn-sm btn-danger delete_cluster_button"
                                aria-label="Left Align"
                                data-id="{{ item.id }}"
                                data-col_name="{{ col_name }}"
                        >
                            <span class="glyphicon glyphicon-trash"
                                  aria-hidden="true"></span>
                        </button>
                        -->
                    </td>
                    </tr>
                    {% endfor %}
                    </tbody>
                {% elif type == "inused" %}
                    <thead align="center">
                    <tr>
                        <th>Name</th>
                        <th>User</th>
                        <th>Type</th>
                        <th>Health</th>
                        <th>Size</th>
                        <th>Host</th>
                        <th>Apply Time</th>
                        <th></th>
                    </tr>
                    </thead>
                    <tbody>
                    {% for item in items %}
                        <tr>
                            <td>
                                <a href="/view/cluster/{{ item.id }}?released=0">{{ item.name }}</a>
                            </td>
                            <td>{{ item.user_id }}</td>
                            {% if item.consensus_plugin== consensus_plugins[0] or item.consensus_plugin== consensus_plugins[2] %}
                                <td>{{ item.consensus_plugin }}</td>
                            {% else %}
                                <td>{{ item.consensus_plugin }}/{{ item.consensus_mode }}</td>
                            {% endif %}
                            <td>
                                {% if item.health == "OK" %}
                                    <font color="green">{{ item.health }}</font>
                                {% else %}
                                    <font color="red">{{ item.health }}</font>
                                {% endif %}
                            </td>
                            <td>{{ item.size|string }}</td>
                            <td>
                                <a href="/view/host/{{ item.host_id }}">{{ item.host_id }}</a>
                            </td>
                            <td>{{ item.apply_ts }}</td>
                            <td>
                                <div class="dropdown">
                                    <button class="btn btn-sm btn-primary btn-info btn-default dropdown-toggle"
                                            type="button" id="chain_actions"
                                            data-toggle="dropdown">
                                        Actions
                                        <span class="caret"></span>
                                    </button>
                                    <ul class="dropdown-menu" role="menu">
                                        <li
                                                {% if item.status == "running" %}
                                                    class="disabled"
                                                {% endif %}
                                        >
                                            <a href="#"
                                               class="chain_action_start"
                                               data-id="{{ item.id }}"
                                               title="Start a chain"
                                            >
                                  <span class="glyphicon glyphicon-play"
                                        aria-hidden="true"></span>
                                                Start
                                            </a>
                                        </li>
                                        <li
                                                {% if item.status != "running" %}
                                                    class="disabled"
                                                {% endif %}
                                        >
                                            <a href="#"
                                               class="chain_action_stop"
                                               data-id="{{ item.id }}"
                                               title="Stop a chain"
                                            >
                                  <span class="glyphicon glyphicon-stop"
                                        aria-hidden="true"></span>
                                                Stop
                                            </a>
                                        </li>
                                        <li>
                                            <a href="#"
                                               class="chain_action_restart"
                                               data-id="{{ item.id }}"
                                               title="Restart a chain"
                                            >
                                  <span class="glyphicon glyphicon-repeat"
                                        aria-hidden="true"></span>
                                                Restart
                                            </a>
                                        </li>
                                        <li>
                                            <a href="#"
                                               class="chain_action_delete"
                                               data-id="{{ item.id }}"
                                               data-col_name="{{ col_name }}"
                                               title="Delete a chain"
                                            >
                                  <span class="glyphicon glyphicon-trash"
                                        aria-hidden="true"></span>
                                                Delete
                                            </a>
                                        </li>
                                        <li>
                                            <a href="#"
                                               class="chain_action_release"
                                               data-id="{{ item.id }}"
                                               title="Release a chain"
                                            >
                                  <span class="glyphicon glyphicon-refresh"
                                        aria-hidden="true"></span>
                                                Release
                                            </a>
                                        </li>
                                    </ul>
                                </div>
                            </td>
                        </tr>
                    {% endfor %}
                    </tbody>
                {% elif type == "released" %}
                    <thead align="center">
                    <tr>
                        <th>Name</th>
                        <th>Type</th>
                        <th>Size</th>
                        <th>Host</th>
                        {% if col_name != "active" %}
                            <th>User</th>
                        {% endif %}
                        <th>Released</th>
                        <th>Duration</th>
                        <th></th>
                    </tr>
                    </thead>
                    <tbody>
                    {% for item in items %}
                        <tr>
                            <td>
                                <a href="/view/cluster/{{ item.id }}?released=1">{{ item.name }}</a>
                            </td>
                            {% if item.consensus_plugin== consensus_plugins[0] or item.consensus_plugin== consensus_plugins[2] %}
                                <td>{{ item.consensus_plugin }}</td>
                            {% else %}
                                <td>{{ item.consensus_plugin }}/{{ item.consensus_mode }}</td>
                            {% endif %}
                            <td>{{ item.size|string }}</td>
                            <td>
                                <a href="/view/host/{{ item.host_id }}">{{ item.host_id }}</a>
                            </td>
                            <td>{{ item.user_id }}</td>
                            <td>{{ item.release_ts }}</td>
                            <td>{{ item.duration }}</td>
                            <td>
                                <button
                                        type="button"
                                        class="btn btn-xs btn-sm btn-danger  delete_cluster_button"
                                        aria-label="Left Align"
                                        data-id="{{ item.id }}"
                                        data-col_name="{{ col_name }}"
                                >
                                    <span class="glyphicon glyphicon-trash"
                                          aria-hidden="true"></span>
                                </button>
                            </td>
                        </tr>
                    {% endfor %}
                    </tbody>
                {% endif %}
            </table>
        </div>
    {% endif %}

{% endblock %}